<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>用户</title>
	<link rel="stylesheet" href="https://cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.min.css">
	<link rel="stylesheet" href="https://cdn.bootcss.com/material-design-lite/1.3.0/material.min.css">
	<link rel="stylesheet" href="assets/css/main.css">
</head>
<body class="my-page">
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
	<header class="mdl-layout__header">
		<div class="mdl-layout__header-row">
			<span class="mdl-layout-title">用户</span>
			<div class="mdl-layout-spacer"></div>
			<nav class="mdl-navigation mdl-layout--large-screen-only">
				<a class="mdl-navigation__link" href="/">返回首页</a>
			</nav>
		</div>
	</header>
	<div class="mdl-layout__drawer">
		<span class="mdl-layout-title">用户</span>
		<nav class="mdl-navigation">
			<a class="mdl-navigation__link" href="/">返回首页</a>
		</nav>
	</div>
	<main class="mdl-layout__content">
		<div id="login-page" class="page-content">
			<div class="login-form mdl-card mdl-shadow--2dp">
				<div class="mdl-card__title mdl-card--expand">
					<h2 class="mdl-card__title-text">登陆</h2>
				</div>
				<div class="mdl-card__supporting-text">
					<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
						<input class="mdl-textfield__input" type="text" id="username">
						<label class="mdl-textfield__label" for="username">用户名</label>
					</div>
					<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
						<input class="mdl-textfield__input" type="password" id="password">
						<label class="mdl-textfield__label" for="password">密码</label>
					</div>
					<div class="verify-code">
						<div class="g-recaptcha" data-sitekey="****"></div>
					</div>
				</div>
				<div class="mdl-card__actions mdl-card--border buttons">
					<button id="login-button" type="button" class="mdl-button loading">
						<div class="mdl-spinner mdl-js-spinner is-active"></div>
						<span>登陆</span>
					</button>
					<a href="/" class="mdl-button">取消</a>
				</div>
			</div>
		</div>
		<div id="my-page" class="page-content" style="display: none;">
			<!-- 上传作品 -->
			<div class="mdl-card mdl-shadow--2dp upload-form">
				<div class="mdl-card__title mdl-card--expand">
					<h2 class="mdl-card__title-text">提交作品</h2>
				</div>
				<div class="mdl-card__supporting-text">
					<div class="mdl-grid">
						<div class="mdl-cell mdl-cell--3-col">注意事项</div>
						<div class="mdl-cell mdl-cell--9-col">
							<div>1.出于安全考虑，服务器禁止执行JSP、PHP脚本</div>
							<div>2.如果使用到了Bootstrap、jQuery等前端库，建议使用<a href="http://www.bootcdn.cn" target="_blank">BootCDN</a>加速</div>
							<div>3.如果项目中包含图片，请对图片进行压缩，保证图片体积较小。<a href="http://www.baidu-x.com/?q=%E5%8E%8B%E7%BC%A9%E5%9B%BE%E7%89%87" target="_blank">如何压缩？</a></div>
							<div>4.如有其他问题，请咨询各班负责人或2班高梓峻</div>
						</div>
					</div>
					<div class="mdl-grid">
						<div class="mdl-cell mdl-cell--3-col">选择文件</div>
						<div class="mdl-cell mdl-cell--9-col">
							<button id="file-button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect">选择文件</button>
							<span id="file-name"></span>
							<input type="file" id="file-input" accept=".zip" style="display: none">
						</div>
					</div>
					<div class="mdl-grid">
						<div class="mdl-cell mdl-cell--3-col">同组成员</div>
						<div class="mdl-cell mdl-cell--9-col team">
							<div class="team-list"></div>
							<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
								<input class="mdl-textfield__input" type="text" id="team-id">
								<label class="mdl-textfield__label" for="team-id">添加同组学号，以“,”结束，可简写</label>
							</div>
						</div>
					</div>
					<div class="mdl-grid">
						<div class="mdl-cell mdl-cell--3-col">选择类型</div>
						<div id="upload-type" class="mdl-cell mdl-cell--9-col"></div>
					</div>
				</div>
				<div class="mdl-card__actions mdl-card--border buttons">
					<button id="upload-button" type="button" class="mdl-button">
						<div class="mdl-spinner mdl-js-spinner is-active"></div>
						<span>提交</span>
					</button>
				</div>
			</div>
			<div class="mdl-card mdl-shadow--2dp change-password">
				<div class="mdl-card__title mdl-card--expand">
					<h2 class="mdl-card__title-text">修改密码</h2>
				</div>
				<div class="mdl-card__supporting-text">
					<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
						<input class="mdl-textfield__input" type="password" id="old-password">
						<label class="mdl-textfield__label" for="old-password">旧密码</label>
					</div>
					<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
						<input class="mdl-textfield__input" type="password" id="new-password">
						<label class="mdl-textfield__label" for="new-password">新密码</label>
					</div>
					<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
						<input class="mdl-textfield__input" type="password" id="new-password2">
						<label class="mdl-textfield__label" for="new-password2">重复新密码</label>
					</div>
				</div>
				<div class="mdl-card__actions mdl-card--border buttons">
					<button id="change-password-button" type="button" class="mdl-button">修改</button>
				</div>
			</div>
		</div>
	</main>
</div>
<script src="https://cdn.bootcss.com/material-design-lite/1.3.0/material.min.js"></script>
<script src="https://cdn.bootcss.com/jszip/3.1.5/jszip.min.js"></script>
<script src="https://recaptcha.net/recaptcha/api.js" async></script>
<script src="assets/js/common.js"></script>
<script src="assets/js/my.js"></script>
</body>
</html>